<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%@ Import Namespace="Vmago.Models.DBML" %>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAQjeWVo6uMCt1ZTLqH9qYVhRtNoRRJC4nGUYHwUlZOhcKpFcC5hTEtpuOTMSWD8qT7EMvf87Fc1m0ag"
    type="text/javascript"></script>

<script type="text/javascript">

    var _GM_Map;
    var _GM_MarkerList = new Array();
    var _GM_CurrentTagID = 0;
    var _GM_LoopEvent = null;
    
    window.onload = function() {

    _Private_Map("map_canvas", 36.5978891330702, 135.6591796875, 6);

    <% List<vw_recShop> oRecShops = (List<vw_recShop>)ViewData["RecShop"];
    foreach (vw_recShop oRecShop in oRecShops) { %>
            var oLatLng = new GLatLng(<%=oRecShop.latitude %>,<%=oRecShop.longitude %>);
            var oMarker = new GMarker(oLatLng, { icon: _Private_GetIcon() });
            _Private_SetTag(oLatLng,oMarker,"<%=Html._V_I_I_RM_GetMarker(oRecShop) %>");
    <% }%>

    _GM_LoopEvent = setInterval(_Private_LoopTag, 5000);    
    
    }
    
    function _Private_Map(strCanvasID, numLat, numLng, numScale){
        if (!GBrowserIsCompatible()) { return; }
        _GM_Map = new GMap2(document.getElementById(strCanvasID));
        _GM_Map.addControl(new GLargeMapControl());
        _GM_Map.addControl(new GMapTypeControl());
        _GM_Map.enableDoubleClickZoom();
        _GM_Map.continuousZoomEnabled();
        _GM_Map.setCenter(new GLatLng(numLat, numLng), numScale);
    }
    
     function _Private_GetIcon(){
        var icon = new GIcon();
        icon.image = "../../Content/img/shopType/info.gif";
        icon.iconAnchor = new GPoint(16, 16);
        icon.infoWindowAnchor = new GPoint(16, 0);
        icon.iconSize = new GSize(16, 16);
        return icon;
    }

    function _Private_SetTag(oLatLng, oMarker, strHtml) {
        GEvent.addListener(oMarker, "click", function() { _GM_Map.openInfoWindowHtml(oLatLng, strHtml); window.clearInterval(_GM_LoopEvent); });
        GEvent.addListener(oMarker, "loop", function() { _GM_Map.openInfoWindowHtml(oLatLng, strHtml); });
        _GM_Map.addOverlay(oMarker);
        _GM_MarkerList.unshift(oMarker);
    }

    function _Private_LoopTag(){
        GEvent.trigger(_GM_MarkerList[_GM_CurrentTagID], "loop");
        if(_GM_CurrentTagID == (_GM_MarkerList.length - 1)){ _GM_CurrentTagID = 0; }
        else{ _GM_CurrentTagID += 1; }
    }
   
</script>

<table width="745" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td height="26" align="left" valign="top" background="../../Content/img/home/right_top.gif">
        </td>
    </tr>
    <tr>
        <td>
            <div id="map_canvas" style="width: 745px; height: 449px"></div>
        </td>
    </tr>
</table>

